import '@mdi/font/css/materialdesignicons.css'
import 'vuetify/styles'
// import { pl, zhHans } from 'vuetify/locale'
import { useI18n } from "vue-i18n";
import i18n from "./i18n";
import { createVueI18nAdapter } from "vuetify/locale/adapters/vue-i18n";

// Composables
import { createVuetify, ThemeDefinition } from 'vuetify'
import { VTreeview } from 'vuetify/labs/VTreeview'


const Lighttheme: ThemeDefinition = {
    dark: false,
    variables: {
      "high-emphasis-opacity": 1,
    },
    colors: {
      background: "#f2f5f8",
      surface: "#ffffff",
      primary: "#344767",
      secondary: "#334155",
      accent: "#705CF6",
      error: "#ef476f",
      info: "#2196F3",
      success: "#06d6a0",
      "on-success": "#ffffff",
      warning: "#ffd166",
    },
  };
  
  const Darktheme: ThemeDefinition = {
    dark: true,
    colors: {
      background: "#111b27",
      surface: "#1E293B",
      primary: "#705CF6",
      secondary: "#598EF3",
      accent: "#705CF6",
      error: "#FF5252",
      info: "#2196F3",
      success: "#4CAF50",
      warning: "#FFC107",
    },
  };
  


// https://vuetifyjs.com/en/introduction/why-vuetify/#feature-guides
export default createVuetify({
    theme: {
      themes: {
        light: Lighttheme,
        dark: Darktheme,
      },
    },
    locale: {
      // locale: 'zhHans',
      // messages: { zhHans, pl },
      adapter: createVueI18nAdapter({ i18n, useI18n }),
    },
    components: {
      VTreeview
    }
  })
  